<script lang="ts" setup>
import {defineComponent} from 'vue'
import ImageListWrap from "./ImageListWrap.vue";
import {Canvas, Group, ImageEvent,Image as LeaferImage} from "leafer-ui";
import {getDefaultName} from "@/views/Editor/utils/utils";
import {Toast} from "tdesign-mobile-vue";
const emit = defineEmits(['success'])
const visibleSticker = ref(false)
const itemClick = (item) => {
  visibleSticker.value = false

}
const open = (type) => {
  visibleSticker.value = true
}
const hide = (type) => {
  visibleSticker.value = false
}
defineExpose({
  open,hide
})
</script>

<template>
  <t-popup v-model="visibleSticker" placement="bottom">
    <div style="height: calc(100vh - 30px)">
      <div class="pop-header">
        <div class="title">背景</div>
        <div class="btn btn--cancel" @click="hide">
          <t-icon name="close-circle" size="18"></t-icon>
        </div>
      </div>
      <div>
        <image-list-wrap style="height: calc(100vh - 100px);overflow: auto" @item-click="itemClick"/>
      </div>
    </div>
  </t-popup>
</template>

<style lang="less" scoped>
@import "../../../styles/pop-style.less";
</style>
